<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="description" content="">
    <meta name="author" content="">
    <title>吊装租赁系统</title>
    <script type="text/javascript" src="jquery/jquery-3.4.1.min.js"></script>
    <link href="bootstrap/css/bootstrap.min.css" rel="stylesheet" >
    <link href="css/signin.css" rel="stylesheet">
</head>
<body style="background-image: url('../images/crane-3639672_1920.jpg')">
<div   class="form-horizontal form-signin" >
    <div class="form-group">
        <img class="img-circle" src="images/crane.jpg" width="120px" height="120px">

        <label for="login_acct" class="col-lg-4 control-label"></label>
        <div class="col-sm-12">
            <input type="text" class="form-control" id="login_acct"  placeholder="账号">
        </div>
    </div>
    <div class="form-group">
        <label for="user_pswd" class="col-sm-2 control-label" ></label>
        <div class="col-sm-12">
            <input type="password" class="form-control" name="user_pswd" id="user_pswd" placeholder="密码">
        </div>
    </div>
    <div class="form-group">
        <label class="red hidden col-md-9" id="error"></label>
    </div>
    <div class="form-group">
        <div class="form-check">
            <input class="form-check-input" type="checkbox" id="gridCheck">
            <label class="form-check-label" for="gridCheck">
                记住我
            </label>
        </div>
    </div>
    <div class="form-group">
        <div class="col-xs-8 col-xs-offset-10">
            <button type="button" id="loginBtn" class="btn btn-lg btn-primary btn-block">登录</button>
        </div>
    </div>
    <div class="panel-footer clearfix">
        <div>
            <p class="mt-5 mb-3 text-muted">
                <button class="btn btn-link pull-right" id="gotoRegistered">
                    立即注册
                </button>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;© 2020-2021 未经授权&nbsp;严禁转载</p>
        </div>
    </div>

</div>
<script>

    $(document).ready(function () {
        // 从localStorage取得用户保存的用户名和密码
        getUserInfo();
        function getUserInfo(){
            $("#login_acct").val(localStorage.getItem("username"));
            $("#user_pswd").val(localStorage.getItem("password"))
        }

        $("#loginBtn").click(function () {
            var username = null;
            $.ajax({
                url:"user/login",
                type:"post",
                dataType:"json",
                data:{
                    loginAcct:$("#login_acct").val(),
                    userPswd:$("#user_pswd").val()
                },
                success:function (result) {
                    var errorCode = result.errorCode;
                    if (errorCode == 0){
                        // 记住用户信息
                        if ($("#gridCheck").click){
                            localStorage.setItem("username",$("#login_acct").val());
                            localStorage.setItem("password",$("#user_pswd").val())
                        }else {
                            localStorage.removeItem("username");
                            localStorage.removeItem("password")
                        }

                        if (result.object.r_id===1) {
                            username = result.object.loginAcct;
                            window.sessionStorage.setItem("username",username);
                            $(location).attr("href","userPage")
                        }else {
                        $(location).attr("href","success")
                        }
                    }else {
                        var err = result.status;
                        $("#user_pswd").val("");
                        $("#error").text(err);
                        $("#error").removeClass("hidden")
                    }
                }
            })

        });

        $("#gotoRegistered").click(function () {
            $(location).attr("href","registered")
        });

    });

</script>
</body>
</html>